<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<title>Cape Town</title>
	<link rel="stylesheet" href="../../css/themes/default/jquery.mobile.css">
	<link rel="stylesheet" href="../_assets/css/jqm-demos.css">
	<link rel="stylesheet" href="swipe-page.css">
	<link rel="shortcut icon" href="../favicon.ico">
	<script src="../../external/jquery/jquery.js"></script>
	<script src="../_assets/js/"></script>
	<script src="../../js/"></script>
	<script src="swipe-page.js"></script>
</head>
<body>

<div id="header" data-role="toolbar" data-type="header" data-id="header" data-position="fixed" data-fullscreen="true" data-tap-toggle="false">
	<h1>Cape Town</h1>
    <a href="./" data-ajax="false" data-direction="reverse" class="ui-button ui-button-icon-only ui-corner-all ui-toolbar-header-button-left"><span class="ui-icon ui-icon-delete"></span>Back</a>
</div><!-- /header -->

<div data-role="page" id="capetown" class="demo-page" data-title="Cape Town" data-dom-cache="true" data-theme="b" data-prev="paris" data-next="seoul">

	<div role="main" class="ui-content">

		<div id="trivia-capetown" class="trivia ui-content" data-role="popup" data-position-to="window" data-tolerance="50,30,30,30" data-theme="a">
        	<a href="#" data-rel="back" class="ui-button ui-button-right ui-button-b ui-button-icon-only ui-corner-all">Close <span class="ui-icon ui-icon-delete"></span></a>
        	<p> Although it’s the youngest official language in the world, Afrikaans is most widely spoken and is home language for 40% of the Cape's population. The remainder of the population speaks either Xhosa or English as a home language. <small>source:&nbsp;gotravel24.com</small></p>
        </div>

	</div><!-- /content -->

</div><!-- /page -->

<div data-role="toolbar" data-type="footer" id="footer" data-id="footer" data-position="fixed" data-fullscreen="true" data-tap-toggle="false">
	<div data-role="controlgroup" class="control ui-toolbar-header-button-left" data-mini="true">
    	<a href="#" class="prev ui-button ui-button-icon-only">Previous <span class="ui-icon ui-icon-caret-l"></span></a>
    	<a href="#" class="next ui-button ui-button-icon-only">Next <span class="ui-icon ui-icon-caret-r"></span></a>
    </div>

	<a href="#trivia-capetown" id="trivia-button" data-rel="popup" class="trivia-button ui-button ui-toolbar-header-button-right ui-mini ui-corner-all">Trivia <span class="ui-icon ui-icon-info"></span></a>
</div><!-- /footer -->

</body>
</html>
